<template>
	<view>
		<uni-search-bar bgColor="white" placeholder="请输入社团名" @confirm="search" @cancel="reset" @clear="reset" />
		<!-- 社团列表 -->
		<view style="margin-top: 40rpx;" v-for="(org,index) in myOrganizationInfoList" :key="index">
			<view @click="navigateToDetail(org.organId,org.organName)" style="display: flex;justify-content: center;">
				<view style="display: flex;justify-content: space-around;width: 92%;border-bottom: 1rpx solid #C0C0C0;">
					<view style="width: 65%">
						<view style="font-weight: bolder">{{org.organName}}</view>
						<view style="color: #808080;font-size: smaller;margin-top: 10rpx;">{{org.orgMinisterName}}
						</view>
						<view style="color: #808080;margin-top: 20rpx;font-size: small;overflow: hidden;">
							{{org.organIntroduction}}
						</view>
					</view>
					<view style="width: 30%;display: flex;justify-content: center;align-items: center;">
						<view>
							<img style="width:200rpx;height: 160rpx;" :src="org.organAvatar" alt="社团封面">
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				pageRequest: {
					pageNo: 0,
					pageSize: 10,
					name: null
				},
				myOrganizationInfoList: []
			}
		},
		onLoad() {
			// 分页获取我的社团信息
			this.getMyOrganization()
		},
		onShow() {
			// 分页获取我的社团信息
			this.getMyOrganization()
		},
		// 监听下拉刷新动作
		onPullDownRefresh() {
			// 重新获取数据
			this.pageRequest.name = null;
			this.pageRequest.pageNo = 0;
			this.myOrganizationInfoList = [];
			this.getMyOrganization();
			setTimeout(function() {
				// 停止下拉刷新
				uni.stopPullDownRefresh();
			}, 1000);
		},
		onBackPress(e) {
			uni.switchTab({
				url: '/pages/my/my'
			});
			// return true 表示禁止默认返回
			return true
		},
		methods: {
			// 清除
			reset() {
				this.pageRequest.name = null;
				this.pageRequest.pageNo = 0;
				this.myOrganizationInfoList = [];
				this.getMyOrganization()
			},
			// 搜索
			search(res) {
				// 设置值
				this.pageRequest.pageNo = 0;
				this.pageRequest.name = res.value
				this.myOrganizationInfoList = [];
				// 重新获取值
				this.getMyOrganization()
			},
			// 获取我的社团信息
			getMyOrganization() {
				this.pageRequest.pageNo++;
				this.$http.request({
					url: '/organizations/web/organization/myPage',
					method: 'POST',
					data: this.pageRequest
				}).then(res => {
					res = res.data;
					if (res.result) {
						this.myOrganizationInfoList = [
							...this.myOrganizationInfoList,
							...res.data
						]
					} else {
						uni.showToast({
							title: res.data,
							icon: 'none'
						});
					}
				})
			},
			// 页面下拉到底部
			onReachBottom() {
				// 当前页+1
				this.getMyOrganization()
			},
			// 我的社团详情
			navigateToDetail(organId, organName) {
				uni.navigateTo({
					url: './myOrganizationDetail?orgId=' + organId + '&orgName=' + organName
				})
			}
		}
	}
</script>

<style>
</style>
